<template>
  <div class="adv-div" v-show="searchVisible">
    <div class="triangle"></div>
    <div class="advancedSearchSty" >
      <el-select clearable class="adv_select" style="width: 155px;" v-model="queryObj.nodeType" :placeholder="inputHolder[0]">
        <el-option
          v-for="item in nodeType"
          :key="item.value"
          :label="item.label"
          :value="item.value">
        </el-option>
      </el-select>
      <el-select clearable class="adv_select" style="width: 155px;" v-model="queryObj.installWay" :placeholder="inputHolder[1]">
        <el-option
          v-for="item in installWay"
          :key="item.value"
          :label="item.label"
          :value="item.value">
        </el-option>
      </el-select>
      <el-select clearable class="adv_select" style="width: 155px;" v-model="queryObj.configSynState" :placeholder="inputHolder[2]">
        <el-option
          v-for="item in configSynState"
          :key="item.value"
          :label="item.label"
          :value="item.value">
        </el-option>
      </el-select>
      <el-button class="adv_but" type="primary" @click="queryEcs(queryObj)">搜索</el-button>
    </div>
  </div>
</template>
<script>
import '../../assets/iconfont/iconfont.css';
import '../../css/style.css';
export default {
  data () {
    return {
      adv_sty_show:"iconfont icon-xiangxiazhanhang",
      adv_sty_hide:"iconfont icon-xiangshangzhanhang",
      queryObj:{
        "ip":'',
        "nodeType":'',
        "installWay":'',
        "configSynState":'',
        "pageNo":'',
        "pageSize":''
      },
    }
  },
  props:['searchVisible','inputHolder','nodeType','installWay','configSynState'],
  mounted(){
  },
  methods: {
    queryEcs(obj){
      this.$emit('nodeQuery', obj);
    },
  },
}
</script>
<style scoped>
.el-table .warning-row {
  background: oldlace;
}
.el-table .success-row {
  background: #f0f9eb;
}
.adv-div{
  position: relative;
  z-index: 100;
}
.advancedSearchSty{
  background-color: #FFFFFF;
  width: 100%;
  height: 100%;
  margin: 10px 0 10px 0;
  box-shadow: 0px 2px 50px 0px rgba(0, 0, 0, 0.08);
}
.triangle{
  width:15px;
  height:15px;
  position: absolute;
  z-index: 99;
  left: 1620px;
  top:-7.5px;
  box-shadow: 0px 2px 50px 0px rgba(0, 0, 0, 0.08);
  transform: rotate(45deg);
  background-color: #FFFFFF;
}
</style>
